// base
require("../../both/base.js");

// css
require("./AdminSidebar.scss");

// code
// 页面内注入列表内容
class AdminSidebar extends React.Component{
    constructor(){
        super()
        this.switchState = 1    // 初始化
        var menuIdxEle = document.getElementById("menuIdx")
        this.menuIdx = menuIdxEle ? menuIdxEle.dataset.idx || 0 : 0
    }

    switchSidebar(){
        var sidebar_switch = document.getElementById("sidebar_switch")

        var adminContent = document.getElementById("AdminContent")
        var adminSidebar = document.getElementById("AdminSidebar")

        if(this.switchState == 1){
            adminSidebar.className += " hide "
            sidebar_switch.className += " show "

            adminContent.style.paddingLeft = "0"
        }else{
            adminSidebar.className = adminSidebar.className.replace("hide","")
            sidebar_switch.className = sidebar_switch.className.replace("show","")

            adminContent.style.paddingLeft = "200px"
        }
        this.switchState =  1 - this.switchState
    }

    render(){
        const switchSidebar = this.switchSidebar.bind(this)

        return (
            <div className="admin_sidebar_cr bln" id="admin_sidebar_cr">
                <div className="sidebar_title">
                    课程
                </div>
                <div className="sidebar_switch" id="sidebar_switch" onClick={switchSidebar}><i className="fa fa-angle-double-left"></i></div>
                <div className="sidebar_list">
                    <ul className="sl">
                        <a href="/admin/overview"><li className={this.menuIdx == "0" && "cur"}>概览</li></a>
                        <a href="/admin_home/course"><li className={this.menuIdx == "1" && "cur"}>课程管理</li></a>
                        <a href="/admin/students"><li className={this.menuIdx == "2" && "cur"}>学生管理</li></a>
                        <a href="/admin/forum"><li className={this.menuIdx == "3" && "cur"}>论坛管理</li></a>
                        <a href="/admin/articles"><li className={this.menuIdx == "4" && "cur"}>文章管理</li></a>
                        <a href="/admin/index_pictures"><li className={this.menuIdx == "5" && "cur"}>首页轮播图管理</li></a>
                        {/*<a href="/admin/course_recommend"><li className={this.menuIdx == "4" && "cur"}>推荐课程管理</li></a>*/}
                    </ul>
                    <ul className="recycle_bin">
                        <hr className="seg"/>
                        <a href=""><li>统计</li></a>
                    </ul>
                </div>
            </div>
        )
    }
}

export default AdminSidebar;